{% extends 'layout.html' %}
{% block css %}
<style>
.text-truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


</style>

{% endblock %}

{% block content %}
        <div class="container">
        <div style="margin-bottom: 10px">


            {% if request.path_info != '/game/out/list/' %}
                {% if request.user.usertype != 4 and request.user.usertype != 5 %}
            <a class="btn btn-success" href="/game/add/" >
                <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
                新建点券订单
            </a>
                    {% endif %}
            {% endif %}

            <div style="float:right;width: 300px;">
                <form method="get">
                    <div class="input-group">
                        <input type="text" name="q" class="form-control" placeholder="搜索" search_data="{{ search_data }}">
                        <span class="input-group-btn">
                        <button class="btn btn-default" type="submit">
                        <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                        </button>
                </span>
                    </div><!-- /input-group -->
                </form>
            </div><!-- /.row -->
        </div>

        <div class="panel panel-default">
      <!-- Default panel contents -->
      <div class="panel-heading">

          <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
          点券订单列表
      </div>

      <!-- Table -->
      <table class="table table-bordered ">
        <thead>
          <tr>
            <th>ID</th>
            <th>游戏名称</th>
            <th>面额大小</th>
              <th>充值链接</th>

              <th>客户名称</th>
              <th>入库人</th>
              <th>订单号</th>
          <th>订单创建时间</th>
               {% if request.path_info == '/game/out/list/' %}
              <th>订单结束时间</th>
                  <th>订单状态</th>
                  <th>出库人</th>
              {% endif %}
              <th>操作</th>
          </tr>
        </thead>
        <tbody>
        {% for obj in queryset %}
            <tr>
            <th>{{ obj.id }}</th>
            <td>{{ obj.get_game_name_display }}</td>
            <td>{{ obj.denomination }}</td>
            <td>

            <div class="text-truncate" style="max-width: 180px;" title="{{ obj.charge_link }}">
                <span id="charge_link_{{ obj.id }}">{{ obj.charge_link }}</span>
            </div>
            <button class="btn btn-primary btn-xs" onclick="copyToClipboard('{{ obj.id }}')">复制</button>

            </td>

            <td>{{ obj.consumer }}</td>
            <td>{{ obj.in_storage_person }}</td>
            <td>{{ obj.order_number }}</td>
            <td>{{ obj.order_create_time|date:"Y-m-d H:i:s" }}</td>
            {% if request.path_info == '/game/out/list/' %}
                <td>{{ obj.order_finish_time|date:"Y-m-d H:i:s" }}</td>
                <td>{{ obj.get_order_status_display }}</td>
                <td>{{ obj.out_storage_person }}</td>
            {% endif %}

            <td>
             {% if request.path_info != '/game/out/list/' %}
                 {% if request.user.usertype == 1 or request.user.usertype == 2 or request.user.usertype == 3  %}
                <a class="btn btn-primary btn-xs" href="/game/edit/{{ obj.id }}/">编辑</a>
                <a class="btn btn-danger btn-xs" href="/game/delete/{{ obj.id }}/">删除</a>
                     {% endif %}
                 {% if not request.user.usertype == 3 %}
                <a class="btn btn-danger btn-xs" href="/game/out/{{ obj.id }}/">出库</a>
                     {% endif %}
            {% endif %}
             {% if request.path_info == '/game/out/list/' %}
                  {% if not request.user.usertype == 3 %}
            <a class="btn btn-danger btn-xs" href="/game/out/reout/{{ obj.id }}/">回调</a>
                      {% endif %}
            {% endif %}
            </td>

        {% endfor %}
        </tbody>
      </table>
    </div>
    <ul class="pagination" style="float:left;">
                {{ page_string }}
            </ul>

    </div>
</div>
{% endblock %}


{% block js %}
<script>
    function copyToClipboard(id) {
        // 获取指定元素的内容
        var copyText = document.getElementById("charge_link_" + id).textContent;

        // 使用 Clipboard API 将内容写入剪贴板
        navigator.clipboard.writeText(copyText)

    }
</script>
{% endblock %}
